<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>空闲车位查看</title>
<link rel="stylesheet" type="text/css" href="../../css/bootstrap.min.css">
<style type="text/css">
	#showPort{
		margin-top:20px;
		width:950px;
		margin:0 auto;
		margin-top:20px;
		height:200px;
	}
	#port_position{
		width:220px;
	}
	#port_Number{
		width:180px;
	}
	#BtnDiv{
		width:300px;
		margin:0 auto;
		margin-top:20px;
		margin-left:400px;
	}
	#bodyDiv{
		margin:0 auto;
	}
	td{
		text-align:center;
	}
</style>
</head>
<body>
	<input type="hidden" id="companyID" value="${sessionScope.myCompany.companyID }" >
	<div id="bodyDiv">
		<div style="margin-top:100px;" id="showPort">
			<table id="showTablei" class="table table-bordered">
				<tr>
					<td>编号</td>
					<td id="port_position">位置</td>
					<td>车位号</td>
					<td id="rentTime">最长可租日期</td>
				</tr>
			</table>
		</div>
		<div id="BtnDiv">
			<input type="button" id="UpBtni" onclick="pageUpi()" class="btn btn-info" value="上一页" >
			<label id="lbb1"></label>
			<label>/</label>
			<label  id="lbb3"></label>
			<input type="button" id="DownBtni" onclick="pageDowni()" class="btn btn-info" value="下一页" >
		</div>
	</div>
	<script type="text/javascript" src="../../js/jquery-3.1.0.min.js"></script>
	<script type="text/javascript">
		var curPagei=1;
		var maxPagei=1;
		var countNumi = 0;
		var pageSizei = 0
		$(function(){
			sendPagei();
		})
		function pageUpi(){
			document.getElementById("DownBtni").disabled=false;
			curPagei=curPagei-1;
			if(curPagei<1){
				curPagei=1;
			}
			countNumi=countNumi-(3+pageSizei);
			if(countNumi<0){
				countNumi=0;
			}
			$('#showTablei tr:gt(0)').remove();
			sendPagei();
		}
		function pageDowni(){
			curPagei=curPagei+1;
			if(curPagei>maxPagei-1){
				curPagei=maxPagei
				document.getElementById("DownBtni").disabled=true;
			}
			$('#showTablei tr:gt(0)').remove();
			sendPagei();
		}
		function sendPagei(){
			var stri = "";
			$.ajax({
				   type: "POST",
				   url: "../../findCompanyUsefulCarPort.do",
				   data: {"needPagei":curPagei,"compIDi":$("#companyID").val()},
				   success: function(msg){
					   console.info(msg);
					   maxPagei=msg.countPage;
					   $("#lbb1").html(curPagei);
				   	   $("#lbb3").html(maxPagei);
				   	   if(msg.list.length==0){
				   		 $("#lbb3").html("");
				   		 $("#lbb1").html("");
				   	   }
				   	   for(var i=0;i<msg.list.length;i++){
				   		 countNumi = countNumi+1;
				   		 stri += "<tr><td>"+countNumi+"</td><td>"+msg.list[i][0]+"</td><td>"+msg.list[i][1]+"</td>"
				   		 +"<td>"+new Date(msg.list[i][2]).toLocaleDateString()+"</td></tr>";
				   	   }
			 	  	   pageSizei = msg.list.length;
			 	  	   $("#showTablei").append(stri);
				   }
			});
		}
	</script>
</body>
</html>